import { DownOutlined } from '@ant-design/icons';
import { Dropdown, Space } from 'antd';
import React, { useState } from 'react';
const DropTest = () => {
    const [open, setOpen] = useState(false);
    const handleMenuClick = (e) => {
        if (e.key === '3') {
            setOpen(false);
        }
    };
    const handleOpenChange = (flag) => {
        setOpen(flag);
    };
    const items = [
        {
            label: 'Clicking me will not close the menu.',
            key: '1',
        },
        {
            label: 'Clicking me will not close the menu also.',
            key: '2',
        },
        {
            label: 'Clicking me will close the menu.',
            key: '3',
        },
    ];
    return (
        <Dropdown
            menu={{
                items,
                onClick: handleMenuClick,
            }}
            onOpenChange={handleOpenChange}
            open={open}
        >
            <a onClick={(e) => e.preventDefault()}>
                <Space>
                    Hover me
                    <DownOutlined />
                </Space>
            </a>
        </Dropdown>
    );
};
export default DropTest;